//入口函数
$(function () {
  //需求1:用户退出
  $("#logout").on("click", function () {
    //提示框
    layer.confirm(
      "确认退出登录吗?",
      { icon: 3, title: "提示" },
      function (index) {
        //跳转到登录页面,清除token
        location.href = "/login.html";
        localStorage.removeItem("token");
        layer.close(index);
      }
    );
  });

  //需求2: 渲染用户名和头像
  //不要把getUserInfo()写到退出登录的逻辑中
  getUserInfo();
});

//获取用户信息,熏染用户名和头像功能封装
//封装写到入口的外边,要这个函数是全局函数,后面的修改用户信息和头像成功后,要用
function getUserInfo() {
  axios({
    method: "GET",
    url: "/my/userinfo",
    // headers: {
    //   Authorization: localStorage.getItem("token"),
    // },
  }).then((res) => {
    // console.log(res.data);
    // console.log(res);
    //判断状态
    if (res.data.status !== 0) {
      return layui.layer.msg(res.data.message);
    }
    //渲染用户名和头像
    renderUserInfo(res.data.data);
  });
}

function renderUserInfo(user) {
  // console.log(user);
  //欢迎 ,名称有要求:优先赋值昵称,不存在才赋值登录名称
  let name = user.nickname || user.username;
  //欢迎赋值
  $(".welcome").html("欢迎&nbsp;&nbsp;" + name);

  //判断有没有图片头像
  if (user.user_pic == null) {
    //没有图片头像, 显示文字头像,隐藏图片头像
    $(".avater_text").show().html(name[0].toUpperCase());
    $(".avater-img").hide();
  } else {
    //有图片头像, 隐藏文字头像,显示图片头像
    $(".avater_text").hide();
    //attr操作自定义属性,prop操作表单属性
    $(".avater-img").show().attr("src", user.user_pic);
  }
}
